﻿<template>
  <el-select v-model="value" multiple placeholder="请选择">
    <el-option-group
      v-for="group in options"
      :key="group.label"
      :label="group.label"
    >
      <el-option
        v-for="item in group.options"
        :key="item.value"
        :label="item.label"
        :value="item.value"
      >
      </el-option>
    </el-option-group>
  </el-select>
</template>
<script>
  export default {
    data() {
      return {
        options: [
          {
            label: '蔬菜',
            options: [
              {
                value: 'bocai',
                label: '菠菜',
              },
              {
                value: 'xihongshi',
                label: '西红柿',
              },
            ],
          },
          {
            label: '水果',
            options: [
              {
                value: 'pingguo',
                label: '苹果',
              },
              {
                value: 'xiangjiao',
                label: '香蕉',
              },
            ],
          },
        ],
        value: '',
      }
    },
  }
</script>
